<template>
	<div class="content">
		<h2>热门精选</h2>
		<div class="list">
			<template v-for="(item, index) in houselist" :key="item.data.houseId">
				<houseItemType9
					:item-data="item.data"
					v-if="item.discoveryContentType === 9"
					@click="itemClick(item.data)"
				/>
				<houseItemType3
					:item-data="item.data"
					v-else-if="item.discoveryContentType === 3"
					@click="itemClick(item.data)"
				/>
			</template>
		</div>
	</div>
</template>

<script setup>
	import houseItemType9 from "@/components/house-item-type9/house-item-type9.vue"
	import houseItemType3 from "@/components/house-item-type3/house-item-type3.vue"
	import useHomeStore from "@/stores/modules/home"
	import { storeToRefs } from "pinia"
	import { useRouter } from "vue-router"
	const homestore = useHomeStore()
	const { houselist } = storeToRefs(homestore)
	const router = useRouter()

	const itemClick = (item) => {
		router.push("/detail/" + item.houseId)
	}
</script>

<style scoped>
	.content {
		padding-bottom: 100px;
	}
	.list {
		display: flex;
		flex-wrap: wrap;
	}
	h2 {
		padding: 10px;
	}
</style>
